// 该组件就是循环便利路由数组得
import React from 'react'
import { Route, Switch, NavLink, Link,Redirect } from 'react-router-dom'
import {Suspense} from "react"  // 路由没加载出的loading
function RouterView(props) { // 函数组件在第一个形参props里就是父组件传递过来得数据
    //   console.log(props)
    let { RouterList } = props
    console.log(RouterList, 1111)
    let routerList = RouterList.filter((item, index) => {
        return !item.to
    })
    let redirect = RouterList.filter((item, index) => {
        return item.to
    })[0]
    console.log(routerList,10000000000000000)
    console.log(redirect)
    return (
        <Suspense fallback={<div>...loading</div>}>
            <Switch>
            {
                routerList&&routerList.length?routerList.map((item,index)=>{
                    // Route 标签上的render属性代替了以前一个一个写的Route标签上的component属性
                    // routerProps就是路由信息参数
                    return <Route path={item.path} key={index} render={(routerProps)=>{
                        if (item.children) {
                            return <item.component {...routerProps} child={item.children} title = {item.children.filter(item=>item.title)}></item.component>
                        }
                      return <item.component {...routerProps} title= {item.title} send={"123456"} ></item.component>
                    }}></Route>
                }):"暂无路由"
            }
            {
                redirect?<Redirect to={redirect.to} from={redirect.from}></Redirect>:"暂无重定向"
            }
            </Switch>
        </Suspense>
    )
}
export default RouterView
